<template>
	<view class="order-result-page">
		<view class="order-result-header">
			<view class="order-message">
				<view class="message-header">
					<image class="icon-success" src="@/static/images/icon_order_success.png"></image>
					<text>订单提交成功</text>
				</view>
				<view v-if="isStore" class="message-body">请保价时间内尽快到店回收,以免再次降价</view>
				<view v-else class="message-body">请尽快寄出以免再次降价</view>
				<view class="message-footer">
					<image class="icon-tip" src="@/static/images/icon_order_tip.png"></image>
					<text v-if="isPost">已为您全程投保，请放心交给顺丰小哥(往返包邮)。</text>
					<text v-else-if="isVisit">客服将联系您确认上门时间及地点，请保持手机畅通。</text>
					<template v-else-if="isStore">
						<text>根据公安要求，请在到店时</text>
						<text class="red">务必携带身份证或电子身份证</text>
					</template>
				</view>
			</view>
			<view class="order-info-cell">
				<view class="order-cell">
					<text>订单编号</text>
					<text>{{ orderInfo.orderNum || '-' }}</text>
				</view>
				<template v-if="isPost">
					<view class="order-cell">
						<text>物流单号</text>
						<text>{{ orderInfo.code || '-' }}</text>
					</view>
					<view class="order-cell">
						<text>顺丰上门时间</text>
						<text>{{ orderInfo.time || '-' }}</text>
					</view>
				</template>
				<view v-else-if="isVisit" class="order-cell">
					<text>上门时间</text>
					<text>{{ orderInfo.time || '-' }}</text>
				</view>
				<view v-else-if="isStore" class="order-cell">
					<text>预约时间</text>
					<text>{{ orderInfo.time || '-' }}</text>
				</view>
			</view>
		</view>
		<view class="order-result-body">
			<view class="recycle-tips-header">回收前请您提前准备</view>
			<view class="recycle-tips-desc">完成以下步骤，预计可提高收款速度30%</view>
			<view class="recycle-steps">
				<template
					v-for="(item, index) in stepList"
				>
					<view
						v-if="!item.recycleType || item.recycleType === orderInfo.recycleType"
						:key="index"
						class="recycle-step"
					>
						<view class="step-image">
							<image class="icon-step" mode="widthFix" :src="item.icon"></image>
						</view>
						<view class="step-desc">{{ item.title }}。</view>
					</view>
				</template>
			</view>
		</view>
		<view class="order-result-footer">
			<view class="button-content">
				<view class="button" @click="toHome">返回首页</view>
				<view class="button yellow" @click="toOrder">查看订单</view>
			</view>
		</view>
	</view>
</template>

<script>
import { beforeRecycleList } from '@/config'

export default {
	computed: {
		isPost () {
			return this.orderInfo.recycleType === '1'
		},
		isVisit () {
			return this.orderInfo.recycleType === '2'
		},
		isStore () {
			return this.orderInfo.recycleType === '6'
		},
	},
	data () {
		return {
			orderNum: '',
			orderInfo: {},
			stepList: beforeRecycleList
		}
	},
	methods: {
		async getOrderResult () {
			const [res] = await this.$apis.getOrderResult({
				orderNum: this.orderNum
			})
			if (res._errCode === '0') {
				this.orderInfo = res._data || {}
			} else {
				uni.showToast({
					title: res._errStr || '获取下单信息失败',
					icon: 'none'
				})
			}
		},
		toHome () {
			uni.switchTab({
				url: '/pages/index/index'
			})
		},
		toOrder () {
			uni.navigateTo({
				url: `/pages/order/detail/index?orderNum=${this.orderInfo.orderNum}`
			})
		}
	},
	onLoad (options) {
		this.orderNum = options.orderNum || ''
		this.getOrderResult()
	}
}
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>
